<template>
  <el-card style="width: 400px; min-width: 400px; padding: 10px">
    <div style="display: flex; justify-content: center; margin-bottom: 20px">
      <img src="@/assets/img/logo.png" width="200" />
    </div>
    <div class="nav">
      <div
        v-for="nav in navs"
        :key="nav"
        :class="{ selected: nav === currentNav }"
        @click="navSwitch(nav)"
      >
        {{ nav }}
      </div>
    </div>

    <el-form ref="form" :model="form">
      <el-form-item>
        <el-input v-model="form.username" placeholder="用户名"></el-input>
      </el-form-item>
      <el-form-item>
        <el-input
          v-model="form.password"
          type="password"
          placeholder="密码"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <div style="display: flex; justify-content: center">
          <el-button type="primary" @click="onSubmit" style="width: 100%"
            >登录</el-button
          >
          <!-- <el-button type="primary" @click="regedit">注册</el-button> -->
        </div>
        <div @click="regedit">
          <span class="change-reg">还没有账号?去注册</span>
        </div>
      </el-form-item>
    </el-form>
  </el-card>
</template>

<script>
export default {
  emits: ["regedit"],
  data() {
    return {
      navs: ["我要找工作", "我要招人"],
      currentNav: "我要找工作",
      form: {
        username: "",
        password: "",
      },
    };
  },
  methods: {
    navSwitch(nav) {
      this.currentNav = nav;
    },
    onSubmit() {
      if (this.currentNav === "我要找工作") {
        this.form.type = "employee";
      } else {
        this.form.type = "employer";
      }
      this.axios.post("/user/login", this.form).then((res) => {
        if (res.data.code == 200) {
          sessionStorage.setItem("username", res.data.data.username);
          if (this.form.type == "employee") {
            // 检查基本信息是否填写
            if (res.data.data.employee_info.fillStatus) {
              this.$router.push("/employee/recomment");
            } else {
              this.$router.push("/profile/employee");
            }
          
          } else if(res.data.data.employer_info.fillStatus){
            this.$router.push("/employer/releasePosition");
            // this.$router.push("/employer/releasePosition");
          }else{
            this.$router.push("/profile/employer");
          }
        }
      });
    },
    regedit() {
      this.$emit("regedit");
    },
  },
};
</script>

<style>
.nav {
  display: flex;
  justify-content: space-around;
  padding: 20px;
}
.nav > div {
  font-size: 20px;
  padding: 0.5em;
  cursor: pointer;
}
.selected {
  border-bottom: 3px #409eff solid;
}
.change-reg:hover {
  color: rgb(248, 158, 55);
  cursor: pointer;
}
</style>